<template>
  <div class="about">
    <div class="header" @click="$router.back()">&lt;</div>
    <div class="content">
      <img :src="$route.query.pic" alt="">
      <div>
        <p>￥{{$route.query.price}}</p>
        <button @click="$router.push('/cart')">加入购物车</button>
      </div>
    </div>
  </div>
</template>
<style lang="scss" scoped>
  .header {
  width: 100%;
  height: 40px;
  line-height: 40px;
  padding-left: 15px;
  background-color: #eee;
  color: skyblue;
  font-size: 24px;}
  .content {
  display: flex;
  padding: 15px;
  img {
  width: 120px;
  height: 120px;}}
  p{
  color: #e23033;
  margin-left: 15px;}
  button {
  border: none;
  outline: none;
  width: 220px;
  height: 40px;
  margin-left: 25px;
  }
</style>
